<template>
  <div>
  <login-top middleTop="注册账号">
    <div slot="right" style="font-size: 3.61vw" @click="$router.push('/login')">切换到登录</div>
  </login-top>

  <login-text label="姓名"
              style="margin: 4.17vw 0"
              placeholder="请输入姓名"
              rule="^.{6,16}$"
              @inputChange="res => model.name=res" />

    <login-text label="帐号" placeholder="请输入帐号" rule=^.{6,16}$ @inputChange="res => model.username=res"></login-text>

    <login-text label="密码"
                placeholder="请输入密码"
                type="password"
                rule=^.{6,16}$
                @inputChange="res => model.password=res"></login-text>

    <login-btn btntext="注册" @registerSubmit="registerSubmit"></login-btn>
  </div>
</template>

<script>
import LoginTop from "../components/common/LoginTop";
import LoginText from "../components/common/LoginText";
import LoginBtn from "../components/common/LoginBtn";
import fn from "../../text";
export default {
name: "register",
  data() {
    return {
      model: {
        name: '',
        username: '',
        password: ''
      }
    }
  },
  components:{
    LoginTop,
    LoginText,
    LoginBtn
  },
  methods:{
   async registerSubmit(){
     let rulg=/^.{6,16}$/
      if(rulg.test(this.model.name)&&rulg.test(this.model.username)&&rulg.test(this.model.password)){
       const res = await this.$http.post('register',this.model)
        this.$msg.fail(res.data.msg)
        localStorage.setItem('id',res.data.id)
        localStorage.setItem('token',res.data.objtoken)
        setTimeout(()=>{
           if(res.data.code==200)
          this.$router.push('/userinfo')
        },1000)
      }else {
        this.$msg.fail('请输入正确的格式')
      }

    }
  }
}
</script>

<style scoped>

</style>
